<template>
	<div class="view">
		<div class="doctorlist">
			<view class="list" v-if="list.length != 0">
				<doctor-item v-for="(item, index) in list" :key="index" :item="item"></doctor-item>
			</view>
		</div>
		<uLi-load-more :status="loadStatus"></uLi-load-more>
	</div>
</template>
<script>
	import {
		selectDoctorByHospital,
		getDoctorList
	} from '@/apis/request.js';
	import DoctorItem from '@/components/doctor-item/doctor-item.vue';

	export default {
		data() {
			return {
				cityId: null,
				departmentId: null,
				pageNo: 1,
				loadStatus: 'loading',
				list: [],
				hospitalId: null
			};
		},
		methods: {
			to(url) {
				uni.navigateTo({
					url
				});
			},
			async getlist() {
				this.loadStatus = 'loading';
				const data = await getDoctorList({
					cityId: this.cityId,
					hospitalId: this.hospitalId,
					departmentId: this.departmentId,
					pageNo: this.pageNo++,
					pageSize: 10
				});
				if (data.records.length == 0) {
					this.loadStatus = 'noMore';
				} else {
					this.loadStatus = 'more';
				}
				this.list.push(...data.records);
				wx.stopPullDownRefresh();
			}
		},
		onLoad(options) {
			uni.setNavigationBarTitle({
				title: options.name
			});
			this.departmentId = options.id;
			this.hospitalId = options.hospitalId || '';
			const city = uni.getStorageSync('city');
			this.cityId = city ? city.id : 350200;
			this.getlist();
		},
		onReachBottom() {
			this.getlist();
		},
		onPullDownRefresh() {
			this.list = [];
			this.loadStatus = 'loading';
			this.pageNo = 1;
			this.getlist();
		}
	};
</script>

<style lang="scss" scoped>
	.view {
		height: auto;

		.doctorlist {
			background-color: #ffffff;

			.item:nth-last-child(1) {
				border: none;
			}
		}
	}
</style>